<template>
  <el-table :data="data" v-loading="loading">
    <el-table-column prop="title" label="标题" width="200" />
    <el-table-column prop="publisherName" label="发布人" width="120" />
    <el-table-column prop="isPinned" label="置顶" width="80">
      <template #default="{row}">
        <el-tag v-if="row.isPinned === 1" type="warning">置顶</el-tag>
        <span v-else>-</span>
      </template>
    </el-table-column>
    <el-table-column prop="type" label="类型" width="120">
      <template #default="{row}">
        <el-tag :type="row.type === 'system' ? 'primary' : 'success'">
          {{ typeMap[row.type] }}
        </el-tag>
      </template>
    </el-table-column>
    <el-table-column prop="status" label="状态" width="100">
      <template #default="{row}">
        <el-switch
          v-model="row.status"
          active-value="active"
          inactive-value="inactive"
          @change="$emit('status-change', row)"
        />
      </template>
    </el-table-column>
    <el-table-column label="操作" width="150">
      <template #default="{row}">
        <el-button link @click="$emit('edit', row.announId)">编辑</el-button>
        <el-button link @click="$emit('delete', row.announId)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup lang="ts">
import type { PropType } from 'vue'

defineProps({
  data: { type: Array as PropType<any[]>, required: true },
  loading: { type: Boolean, default: false }
})

defineEmits(['edit', 'delete', 'status-change'])

const typeMap: Record<string, string> = {
  system: '系统公告',
  sys_exam: '考试公告'
}
</script>